<template>
  <div class="content">
      <header>
        <img src="../../assets/life/banner4.png" alt="">
        <div class="title" @click="goService">
          <i class="iconfont icon-zuojiantou" style="font-size:1rem;"></i>
        </div>
      </header>
      <div style="margin:0 10px;">
      <p>专业除螨</p>
      <p class="tag">螨虫是世界上已知最强烈的过敏源之一，是引起过敏性皮炎，皮肤瘙痒等各类皮肤病的罪魁祸首，宜居保洁选用行业领先的德国进口设备，高效无死角除螨，还您真正健康的居住环境。</p>
      </div>
      <hr>
      <p style="margin-left:10px">服务价格</p>
      <div class="price" v-for="(item ,index) in list" :key="index">
          <div class="left">{{item.name}}</div>
          <div class="right">{{item.price}}</div>
      </div>
      <div class="footer">
          <van-button color="#ff5555">立即预约</van-button>
      </div>
  </div>
</template>

<script>
export default {
    data(){
        return{
            list:[{
                name:"双人床",
                price:"200元/张"
            },{
                name:"单人床",
                price:"170元/张"
            },{
                name:"婴儿床",
                price:"140元/张"
            },{
                name:"布艺沙发",
                price:"140元/张"
            }]
        }
    },
     methods:{
       goService(){
         this.$router.push({path: "/service"})
       }
     }
}
</script>
<style lang="less" scoped>
hr{
  color:#dcdcdc
}
header{
  width: 100%;
//   height: 446px;
  position: relative;
  img{
    width: 100%;
    height: 100%;
  }
  
  .title{
    width: 10%;
    position: fixed;
    top: 0.6rem;
    left: 5px;
    opacity: 0.6;
    i{
        color: #ffffff;
    }
  }
}
p{
    margin: 0;
    font-size: 18px;
    color: #4e4e4e;
    // padding-left: 20px;
}
.tag{
      font-size: 13px;
      color: #a2a2a2;
      opacity: 0.7;
      text-indent: 2em;
        margin-top: 10px;
  }
.price{
    display: flex;
    justify-content: space-between;
    padding: 20px;
    font-size: 13px;
    border-bottom: 1px solid #dcdcdc;
    color: #6b6b6b;
}
.footer{
    width: 100%;
    height: 102px;
    .van-button{
        width: 100%;
        height: 100%;
    }
    }
</style>